var YEAR  = new Date().getFullYear();
var MONTH = new Date().getMonth();
var DATE  = new Date().getDate();
var DAY   = new Date().getDay();
var MODE  = "MONTH";

var SELECTED_YEAR  = YEAR;
var SELECTED_MONTH = MONTH;
var SELECTED_DATE  = DATE;
var SELECTED_DAY   = DAY;

var days = new Array(31, (SELECTED_YEAR % 100 % 4 == 0) ? 29 : 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31);
var date = new Array("Chủ nhật", "Thứ 2", "Thứ 3", "Thứ 4", "Thứ 5", "Thứ 6", "Thứ 7");

var content;
var calendarHeader;
var displayed_month;
var schedule;

function dayObject() {}

function resetSelectedValue() {
    SELECTED_YEAR  = YEAR;
    SELECTED_MONTH = MONTH;
    SELECTED_DATE  = DATE;
    SELECTED_DAY   = DAY;
    days = new Array(31, (SELECTED_YEAR % 100 % 4 == 0) ? 29 : 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31);
    date = new Array("Chủ nhật", "Thứ 2", "Thứ 3", "Thứ 4", "Thứ 5", "Thứ 6", "Thứ 7");
}

var Calendar = function () {
    content = document.getElementById("content");
    calendarHeader = document.getElementById("calendar_header");
    displayed_month = document.getElementById("displayed_month");
    schedule = document.getElementById("schedule");
    showCurrentMonth();
};

function showNormalCalendar() {
    calendarHeader.style.visibility = "visible";
    content.style.visibility = "visible";
    calendarHeader.style.height = "35px";
    content.style.height = "620px";
    schedule.style.visibility = "hidden";
    schedule.style.height = "0px";
}

function showPrevious() {
    if (MODE === "MONTH") {
        SELECTED_MONTH = (SELECTED_MONTH > 0) ? SELECTED_MONTH - 1 : 11;
        SELECTED_YEAR  = (SELECTED_MONTH == 11) ? SELECTED_YEAR - 1 : SELECTED_YEAR;
        days = new Array(31, (SELECTED_YEAR % 100 % 4 == 0) ? 29 : 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31);
        showMonth(SELECTED_YEAR, SELECTED_MONTH);
    }
    else if (MODE === "WEEK") {
        if (SELECTED_DATE - 7 <= 0) {
            SELECTED_MONTH = SELECTED_MONTH == 0 ? 11 : SELECTED_MONTH - 1;
            SELECTED_YEAR  = SELECTED_MONTH == 11 ? SELECTED_YEAR - 1 : SELECTED_YEAR;
            SELECTED_DATE   = days[SELECTED_MONTH] - (7 - SELECTED_DATE);
        }
        else {
            SELECTED_DATE  = SELECTED_DATE - 7;
            SELECTED_MONTH = SELECTED_MONTH;
            SELECTED_YEAR  = SELECTED_YEAR;
        }
        days = new Array(31, (SELECTED_YEAR % 100 % 4 == 0) ? 29 : 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31);
        showWeek(SELECTED_DATE, SELECTED_MONTH, SELECTED_YEAR);
    }
    else if (MODE === "DAY") {
        if (SELECTED_DATE - 1 > 0) {
            SELECTED_DATE = SELECTED_DATE - 1;
            SELECTED_MONTH = SELECTED_MONTH;
            SELECTED_YEAR = SELECTED_YEAR;
        }
        else {
            SELECTED_MONTH = SELECTED_MONTH == 0 ? 11 : SELECTED_MONTH - 1;
            SELECTED_YEAR = SELECTED_MONTH == 11 ? SELECTED_YEAR - 1 : SELECTED_YEAR;
            days = new Array(31, (SELECTED_YEAR % 100 % 4 == 0) ? 29 : 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31);
            SELECTED_DATE = days[SELECTED_MONTH];
        }
        showDay(SELECTED_DATE, SELECTED_MONTH, SELECTED_YEAR);
    }
    else if (MODE === "SCHEDULE") {
        if (SELECTED_DATE - 1 > 0) {
            SELECTED_DATE = SELECTED_DATE - 1;
            SELECTED_MONTH = SELECTED_MONTH;
            SELECTED_YEAR = SELECTED_YEAR;
        }
        else {
            SELECTED_MONTH = SELECTED_MONTH == 0 ? 11 : SELECTED_MONTH - 1;
            SELECTED_YEAR = SELECTED_MONTH == 11 ? SELECTED_YEAR - 1 : SELECTED_YEAR;
            days = new Array(31, (SELECTED_YEAR % 100 % 4 == 0) ? 29 : 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31);
            SELECTED_DATE = days[SELECTED_MONTH];
        }
        showDaySchedule(SELECTED_DATE, SELECTED_MONTH, SELECTED_YEAR);
    }
}

function showNext() {
    if (MODE === "MONTH") {
        SELECTED_MONTH = SELECTED_MONTH < 11 ? SELECTED_MONTH + 1 : 0;
        SELECTED_YEAR  = SELECTED_MONTH == 0 ? SELECTED_YEAR + 1 : SELECTED_YEAR;
        days = new Array(31, (SELECTED_YEAR % 100 % 4 == 0) ? 29 : 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31);
        showMonth(SELECTED_YEAR, SELECTED_MONTH);
    }
    else if (MODE === "WEEK") {
        if (SELECTED_DATE + 7 > days[SELECTED_MONTH]) {
            SELECTED_DATE  = 7 - (days[SELECTED_MONTH] - SELECTED_DATE);
            SELECTED_MONTH = SELECTED_MONTH == 11 ? 0 : SELECTED_MONTH + 1;
            SELECTED_YEAR  = SELECTED_MONTH == 0 ? SELECTED_YEAR + 1 : SELECTED_YEAR;
        } else {
            SELECTED_DATE  = SELECTED_DATE + 7;
            SELECTED_MONTH = SELECTED_MONTH;
            SELECTED_YEAR  = SELECTED_YEAR;
        }
        days = new Array(31, (SELECTED_YEAR % 100 % 4 == 0) ? 29 : 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31);
        showWeek(SELECTED_DATE, SELECTED_MONTH, SELECTED_YEAR);
    }
    else if (MODE == "DAY") {
        if (SELECTED_DATE == days[SELECTED_MONTH]) {
            SELECTED_DATE  = 1;
            SELECTED_MONTH = SELECTED_MONTH == 11 ? 0 : SELECTED_MONTH + 1;
            SELECTED_YEAR  = SELECTED_MONTH == 0 ? SELECTED_YEAR + 1 : SELECTED_YEAR;
        } else {
            SELECTED_DATE  = SELECTED_DATE + 1;
            SELECTED_MONTH = SELECTED_MONTH;
            SELECTED_YEAR  = SELECTED_YEAR;
        }
        days = new Array(31, (SELECTED_YEAR % 100 % 4 == 0) ? 29 : 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31);
        showDay(SELECTED_DATE, SELECTED_MONTH, SELECTED_YEAR);
    }
    else if (MODE === "SCHEDULE") {
        if (SELECTED_DATE == days[SELECTED_MONTH]) {
            SELECTED_DATE  = 1;
            SELECTED_MONTH = SELECTED_MONTH == 11 ? 0 : SELECTED_MONTH + 1;
            SELECTED_YEAR  = SELECTED_MONTH == 0 ? SELECTED_YEAR + 1 : SELECTED_YEAR;
        } else {
            SELECTED_DATE  = SELECTED_DATE + 1;
            SELECTED_MONTH = SELECTED_MONTH;
            SELECTED_YEAR  = SELECTED_YEAR;
        }
        days = new Array(31, (SELECTED_YEAR % 100 % 4 == 0) ? 29 : 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31);
        showDaySchedule(SELECTED_DATE, SELECTED_MONTH, SELECTED_YEAR);
    }
}

function clearContainer() {
    while (content.hasChildNodes()) {
        content.removeChild(content.lastChild);
    }
}

function showCurrentMonth() {
    clearContainer();
    resetSelectedValue() ;
    showNormalCalendar();
    MODE = "MONTH";
    clearCalendarHeader();
    showWeekDate();
    showMonth(SELECTED_YEAR, SELECTED_MONTH);
}

function showCurrentWeek() {
    resetSelectedValue();
    showNormalCalendar();
    clearContainer();
    displayed_month.innerHTML = "";
    MODE = "WEEK";
    showWeek(SELECTED_DATE, SELECTED_MONTH, SELECTED_YEAR);
}

function showWeek(day, month, year) {
    clearCalendarHeader();
    clearContainer();
    var weekDays = new Array();
    var newDate = new Date();
    newDate.setFullYear(year, month, day);
    var daysMonth = new Array(31, (year % 100 % 4 == 0) ? 29 : 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31);
    var newDay = newDate.getDay();

    for (var i = 0; i < date.length; i++) {
        var aDay = new dayObject();
        if (i < newDay) {
            aDay.month = (day-(newDay-i)) > 0 ? (month+1) : ((month == 0) ? 12 : month);
            aDay.year  = (aDay.month == 12) ? year - 1 : year;
            aDay.day = (aDay.month == month+1) ? (day-(newDay-i)) : (daysMonth[aDay.month-1] - (newDay-day)) + i;
        }
        else if (i > newDay) {
            aDay.month = ((day+(i-newDay)) > daysMonth[month]) ? ((month == 11) ? 1 : month+2) : month+1;
            aDay.year  = (aDay.month == 1) ? year + 1 : year;
            aDay.day = (aDay.month == month+1) ? (day+(i-newDay)) : (i-(newDay + daysMonth[month]-day));
        }
        else {
            aDay.month = month+1;
            aDay.year = year;
            aDay.day = day;
        }
        weekDays.push(aDay);
    }

    showWeekHeader(weekDays);
    showWeekContent(weekDays);
}

function clearCalendarHeader() {
    while (calendarHeader.hasChildNodes()) {
        calendarHeader.removeChild(calendarHeader.lastChild);
    }
}

function showWeekDate() {
    var week = document.createElement("ul");
    week.className = "week_date";
    for (var i = 0; i < date.length; i++) {
        var aDate = document.createElement("li");
        aDate.innerHTML = date[i];
        week.appendChild(aDate);
    }
    calendarHeader.appendChild(week);
}

function showWeekHeader(weekDays) {
    var week = document.createElement("ul");
    week.className = "week_date";
    for (var i = 0; i < date.length; i++) {
        var aDay = weekDays[i];
        var day = document.createElement("li");
        day.innerHTML = date[i] + " - " + aDay.day + "/" + aDay.month;
        week.appendChild(day);
    }
    calendarHeader.appendChild(week);
}

function showWeekContent(weekDays) {
    content.style.width = "1300px";
    content.style.overflow = "auto";
    content.style.height = "620px";

    for (var i = 0; i < weekDays.length; i++) {
        var divDate = document.createElement("div");
        divDate.className = "rectangle_week";
        if (i == 0 ) {
            divDate.style.borderLeft = "2px solid #AAC2F7";
            divDate.style.width = "182px";
        }
        if (i == weekDays.length - 1) {
            divDate.style.borderRight = "2px solid #AAC2F7";
            divDate.style.width = "182px";
        }
        if (weekDays[i].day == DATE && weekDays[i].month == MONTH + 1 && weekDays[i].year == YEAR) {
            divDate.style.backgroundColor = "#D3E2F3";
        }


        for (var j = 0; j < 48; j++) {
            var divTime = document.createElement("div");
            divTime.className = "rectangle_time";
            if (j%2 == 0) {
                divTime.style.borderBottom = "1px dashed #AAC2F7";
                if (i == 0) divTime.innerHTML = (j/2 > 10) ? j/2 + ":00" : "0" + j/2 + ":00";
            }
            else {
                divTime.style.borderTop = "none";
            }
            divDate.appendChild(divTime);
        }
        content.appendChild(divDate);
    }
}

function showMonth(year, month) {
    clearContainer();
    var firstDay = new Date();
    firstDay.setFullYear(year, month++, 1);
    displayed_month.innerHTML = "Tháng " + month + " năm " + year;
    var startDay = (firstDay.getDay() == 0) ? 7 : firstDay.getDay();
    var days2Display = new Array();

    var index = 0;
    for (var i = startDay; i > 0; i--) {
        var previousNullDay = new dayObject();
        previousNullDay.month = (month > 1) ? month-1 : 12;
        previousNullDay.year  = (previousNullDay.month == 12) ? year - 1 : year;
        previousNullDay.day   = days[previousNullDay.month-1] - i + 1;
        previousNullDay.text  = previousNullDay.day;
        var lunar = convertSolar2Lunar(previousNullDay.day, previousNullDay.month, previousNullDay.year, 7);
        previousNullDay.lunartext = lunar[0];
        if (lunar[0] == 1) previousNullDay.lunartext += "/" + lunar[1];
        previousNullDay.class = "rectangle_null";
        previousNullDay.index = index++;
        days2Display.push(previousNullDay);
    }

    for (var i = 0; i < days[month-1]; i++) {
        var newDay = new dayObject();
        newDay.year  = year;
        newDay.month = month;
        newDay.day   = i + 1;
        newDay.text  = i + 1;
        var lunar = convertSolar2Lunar(newDay.day, newDay.month, newDay.year, 7);
        newDay.lunartext = lunar[0];
        if (lunar[0] == 1) newDay.lunartext += "/" + lunar[1];
        newDay.class = "rectangle";
        newDay.index = index++;
        days2Display.push(newDay);
    }

    var nextDate = 0;
    while (days2Display.length < 6 * 7) {
        var nextNullDay = new dayObject();
        nextNullDay.month = (month < 12) ? month + 1 : 1;
        nextNullDay.year  = (nextNullDay.month == 0) ? year + 1 : year;
        nextNullDay.day   = ++nextDate;
        nextNullDay.text  = nextNullDay.day;
        var lunar = convertSolar2Lunar(nextNullDay.day, nextNullDay.month, nextNullDay.year, 7);
        nextNullDay.lunartext = lunar[0];
        if (lunar[0] == 1) nextNullDay.lunartext += "/" + lunar[1];
        nextNullDay.class = "rectangle_null";
        nextNullDay.index = index++;
        days2Display.push(nextNullDay);
    }
    displayDays(days2Display);
}

function displayDays(days2Display) {
    for (var i = 0; i < days2Display.length; i++) {
        var aDay = days2Display[i];
        var rectangle = document.createElement("div");
        rectangle.className = aDay.class;

        if (aDay.year == YEAR && aDay.month == MONTH+1 && aDay.day == DATE) rectangle.style.backgroundColor = "#D3E2F3";

        var day = document.createElement("div");
        var lunar = document.createElement("div");
        lunar.className = "lunar";

        if (aDay.index % 7 == 0) {
            rectangle.style.borderLeft = "2px solid #AAC2F7";
            rectangle.style.width = "182px";
            rectangle.style.color = aDay.class == "rectangle" ? "#EA2333" : "#EEB8B8";
            lunar.style.color     = "#EEB8B8";
        }
        else if (aDay.index % 7 == 6) {
            rectangle.style.borderRight = "2px solid #AAC2F7";
            rectangle.style.width = "182px";
            rectangle.style.color = aDay.class == "rectangle" ? "#FF7537" : "#F7CDB8";
            lunar.style.color     = "#F7CDB8";
        }
        if (aDay.index >= 5 * 7) rectangle.style.borderBottom = "2px solid #AAC2F7";
        day.innerHTML = aDay.text;
        day.className = "day";
        rectangle.appendChild(day);
        
        lunar.innerHTML = aDay.lunartext;
        rectangle.appendChild(lunar);
        rectangle.onclick = function () { return showPopup(); };

        content.appendChild(rectangle);
    }
}

function showCurrentDay() {
    MODE = "DAY";
    resetSelectedValue();
    showNormalCalendar();
    showDay(SELECTED_DATE, SELECTED_MONTH, SELECTED_YEAR);
}

function showDay(day, month, year) {
    clearCalendarHeader();
    clearContainer();
    showHeaderDay(day, month, year);
    showDayContent(day, month, year);
    displayed_month.innerHTML = "";
}

function showHeaderDay(day, month, year) {
    var newDate = new Date();
    newDate.setFullYear(year, month, day);
    var divDay = document.createElement("div");
    divDay.className = "day_header";
    if (newDate.getDay() == 0) {
        divDay.style.color = "#EA2333";
    }
    if (newDate.getDay() == 6) {
        divDay.style.color = "#FF7537";
    }
    divDay.innerHTML = date[newDate.getDay()] + ", ngày " + day + " tháng " + (month+1) + " năm " + year;
    calendarHeader.appendChild(divDay);
}

function showDayContent(day, month, year) {
    content.style.width = "1300px";
    content.style.overflow = "auto";
    content.style.height = "620px";

    var divDay = document.createElement("div")
    divDay.className = "rectangle_day";
    divDay.style.borderTop = "none";

    if (day == DATE && month == MONTH && year == YEAR) divDay.style.backgroundColor = "#D3E2F3";

    for (var i = 0; i < 48; i++) {
        var divTime = document.createElement("div");
        divTime.className = "rectangle_time";
        if (i%2 == 0) {
            divTime.style.borderBottom = "1px dashed #AAC2F7";
            divTime.innerHTML = (i/2 > 10) ? i/2 + ":00" : "0" + i/2 + ":00";
        }
        else {
            divTime.style.borderTop = "none";
        }
        divDay.appendChild(divTime);
    }
    content.appendChild(divDay);
}

function showCurrentDaySchedule() {
    MODE = "SCHEDULE"
    resetSelectedValue();
    showDaySchedule(SELECTED_DATE, SELECTED_MONTH, SELECTED_YEAR);
}

function clearSchedule() {
    while (schedule.hasChildNodes()) {
        schedule.removeChild(schedule.lastChild);
    }
}

function showDaySchedule(day, month, year) {
    clearCalendarHeader();
    clearContainer();
    clearSchedule();
    calendarHeader.style.visibility = "hidden";
    content.style.visibility = "hidden";
    calendarHeader.style.height = "0px";
    content.style.height = "0px";
    schedule.style.visibility = "visible";
    schedule.style.height = "600px";
    var newDate = new Date();
    newDate.setFullYear(year, month, day);
    var newDay = newDate.getDay();

    displayed_month.innerHTML = date[newDay] + ", ngày " + day + " tháng " + (month+1) + " năm " + year;

    var headerWrapper = document.createElement("div");
    headerWrapper.className = "schedule_header_wrapper";

    var contentWrapper = document.createElement("div");
    contentWrapper.className = "schedule_content_wrapper";
    if (day == DATE && month == MONTH && year == YEAR) contentWrapper.style.backgroundColor = "#D3E2F3";
    var count = 0;
    for (var i = 0; i < 48; i++) {
        var divHeader = document.createElement("div");
        divHeader.className = "schedule_header";
        if (i%2 == 0) {
            divHeader.innerHTML = i/2 > 10 ? i/2 + ":00" : "0" + i/2 + ":00";
            count = i/2;
        }
        else divHeader.innerHTML = i/2 > 10 ? count + ":30" : "0" + count + ":30";
        headerWrapper.appendChild(divHeader);

        var divContent = document.createElement("div");
        divContent.className = "schedule_content";
        if (i == 47) {
            divContent.style.width = "102.5px";
            divContent.style.borderRight = "2px solid#AAC2F7";
        }
        contentWrapper.appendChild(divContent);
    }
    schedule.appendChild(headerWrapper);
    schedule.appendChild(contentWrapper);
}

function showPopup() {
    var dheight = document.body.clientHeight;
    var dwidth = document.body.clientWidth;
    var popupFrame = document.getElementById("popup_frame");

    var popupPosTop = (dheight - popupFrame.style.height) / 2;
    var popupPosLeft = (dwidth - popupFrame.style.width) / 3;
    var coverDiv = document.createElement("div");
    
    coverDiv.setAttribute("id", "cover");
    coverDiv.onclick = function () { return closeCover() };
    coverDiv.className = "cover";
    popupFrame.parentNode.insertBefore(coverDiv, popupFrame);
    popupFrame.setAttribute('style', 'top:' + popupPosTop + 'px; left:' + popupPosLeft + 'px; visibility: visible;');
}

function closeCover() {
    var coverDiv = document.getElementById("cover");
    coverDiv.parentNode.removeChild(coverDiv);
    var popupFrame = document.getElementById("popup_frame");
    popupFrame.setAttribute('style', 'visibility: hidden;');
}

function tooglePopup() {
//    var popupAdvance = document.getElementById("popup_advance_content");
//    var btnPopupStt = document.getElementById("btnPopupStt");         
//    if (popupAdvance.style.display == "block") {
//        popupAdvance.style.display = "none";
//        btnPopupStt.innerHTML = "Advance";
//    }
//    else {
//        popupAdvance.style.display = "block";
//        btnPopupStt.innerHTML = "Normal";
    //    }
    var myObj = '{"service":"sayGoodbye", "param":"hung"}';    
    $.ajax({
        type: "POST",
        url: "http://localhost:2144/ServiceHost/Api.svc/CallService",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        data: myObj,
        crossDomain: "true",
        success: function (result) {
            alert(result);
        },
        error: function () {
            alert("Ajax error");
        }
    });
}